import React, { PureComponent } from 'react'
import { Modal, Form, Input } from 'antd'

import PropTypes from 'prop-types'

// import Style from './closeOrderModal.css'
const { TextArea } = Input
class closeOrderModal extends PureComponent {
  static propTypes = {
    visible: PropTypes.bool,
    onCancel: PropTypes.func,
    onOk: PropTypes.func,
    form: PropTypes.object
  }

  constructor (props) {
    super(props)
    this.state = {
    }
  }

  handleOnOK = () => {
    const { form, onOk } = this.props
    form.validateFields((err, values) => {
      if (!err) {
        onOk(values)
      }
    })
  }

  render () {
    const { visible, onCancel, form } = this.props
    const { getFieldDecorator } = form
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 4 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 20 }
      }
    }
    return (
      <Modal
        title='关闭订单'
        visible={visible}
        onCancel={onCancel}
        onOk={this.handleOnOK}
      >
        <Form {...formItemLayout}>
          <Form.Item label='操作备注' >
            {getFieldDecorator('operateRemark', {
              rules: [
                { required: true, message: '请输入操作备注' }
              ]
            })(<TextArea />)}
          </Form.Item>
        </Form>
      </Modal>
    )
  }
}

export default Form.create()(closeOrderModal)
